

<?= View::factory('home/menu')->set('step', 2) ?>
<form id='frmstep2' method="post" action="<?= Controller_Helper_Url::full_url() ?>" >
    <div style="text-align: center;padding-top: 10px;">
        <div class='step2table'>
            <table id='table-step2'>
                <tr>
                    <td style="width: 100px;">
                        <span class="title">Ảnh của bạn: </span>
                    </td>
                    <td style="width: 50px;">
                        <input type="button" id='cmdUploadYour' value="Chọn" />
                    </td>
                    <td>
                        <img id='your_imagehtml' src="<?= $_user['avatar'] ?>" style="width: 50px;height: 50px;<?= empty($_user['avatar']) ? 'display:none;' : '' ?>" />
                        <input type="hidden" value="" name='your_image' id='your_image' />
                    </td>
                </tr>
                <tr>
                    <td colspan="3">
                        <div id='uploadfile' style="display:none ;"></div>

                    </td>
                </tr>
                <tr>
                    <td colspan="3">
                        <span class="title">Hãy Tag người bạn muốn gởi thông điệp yêu thương: </span>
                        <input id='addfriend' type="button" value="Chọn" />
                    </td>

                </tr>
                <tr>
                    <td colspan="3">
                        <span style="height: 50px;vertical-align: middle;padding-bottom: 40px;" id='tag_namehtml'></span>
                        <img id='tag_imagehtml' style="display: none;width: 50px;height: 50px;" />

                        <input type="hidden" name='tag_id' id='tag_id' />
                        <input type="hidden" name='tag_name' id='tag_name' />
                        <input type="hidden" name='tag_image' id='tag_image' />
                    </td>
                </tr>
                <tr>
                    <td colspan="3">
                        <span class="title">Lời yêu thương: </span>

                    </td>

                </tr>
                <tr>
                    <td colspan="3">
                        <textarea id='comment' name="comment" style="width: 100%;height: 100px;" maxlength="100"></textarea>

                    </td>

                </tr>
                <tr>
                    <td colspan="3" style="text-align: right;">
                        *Tối thiểu 100 ký tự
                    </td>

                </tr>
            </table>
        </div>
    </div>

    <div style="text-align: center;padding-top: 10px;">
        <div id='divbutton'>
            <a href="javascript:;" id='cmdstep2'>
                <img src="<?= $url_base_theme . '/img/step1.png' ?>" />
            </a>
        </div>

    </div>
</form>
<?php
//for login facebook
$config_facebook = Kohana::$config->load('facebook');
?>
<script>
    window.fbAsyncInit = function() {
        FB.init({
            appId: '<?php echo $config_facebook->appId ?>',
            cookie: true,
            xfbml: true,
            oauth: true
        });


    };
    (function(d) {
        var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
        if (d.getElementById(id)) {
            return;
        }
        js = d.createElement('script');
        js.id = id;
        js.async = true;
        js.src = "//connect.facebook.net/en_US/all.js";
        ref.parentNode.insertBefore(js, ref);
    }(document));


    jQuery("#addfriend").click(function() {
        jQuery("#cmdstep2").attr("disabled",true);
        FB.ui({method: 'apprequests',
            message: 'Hãy tag 1 người bạn muốn.'
        }, function(response) {
            if (typeof (response.to[0]) == 'undefined') {
                alert('Vui lòng tag người bạn muốn gởi thông điệp yêu thương')
            } else {
                jQuery("#tag_id").val(response.to[0]);
                FB.api('/' + response.to[0], {fields: 'name,id,picture'}, function(response) {
                    jQuery("#tag_name").val(response.name);
                    jQuery("#tag_namehtml").html(response.name);
                    jQuery("#tag_image").val(response.picture.data.url);
                    jQuery("#tag_imagehtml").attr('src', response.picture.data.url);
                    jQuery("#tag_imagehtml").show();
                    jQuery("#cmdstep2").removeAttr("disabled");
                });
            }
        });
    })

</script>

<script type="text/javascript">
    $('#uploadfile').ajaxupload({
        url: url_base_media + '/upload_file.php',
        remotePath: '<?= Controller_Helper_Constant::FOLDER_TEMP ?>',
        maxFiles: 10000,
        //editFilename:true,
        autoStart: true,
        bootstrap: true,
        allowExt: ['png', 'jpg'],
        maxFileSize: "10M",
        removeOnSuccess: true,
        success: function(name) {
            jQuery("#your_imagehtml").attr("src", url_base_media + "/" + '<?= Controller_Helper_Constant::FOLDER_TEMP ?>' + "/" + name);
            jQuery("#your_imagehtml").show();
            jQuery("#your_image").val(name);
            jQuery("#cmdstep2").removeAttr("disabled");
        },
 
        error: function(txt, fileName) {
            jQuery("#cmdstep2").removeAttr("disabled");
        },
        onInit: function(au)
        {
            //hide remove files and upload button
            au.removeFiles.hide();
            au.uploadFiles.hide();
            jQuery(".ax-legend").hide();
            jQuery("#cmdUploadYour").click(function(){
          
                jQuery("#uploadfile").find('input:file').click();
            })
        }

    });
    
    

    jQuery("#cmdstep2").click(function() {
        if (jQuery("#tag_id").val() == "") {
            alert('Vui lòng tag người bạn muốn gởi thông điệp yêu thương');
            return false;
        }
        if (jQuery("#your_imagehtml").attr('src') == "") {
            alert('Vui lòng chọn Ảnh của bạn.');
            return false;
        }
        if (jQuery("#comment").val() == "") {
            alert('Vui lòng thêm Lời yêu thương.');
            return false;
        }
        jQuery("#cmdstep2").attr("disabled",true);
        jQuery("#frmstep2").submit();
    })
</script>